<template>
	<view class="space-between" v-if="shoppAll&&shoppAll.length>0">
		<view v-for="(item,index) in shoppAll" :key='item.id' class="images" :style="{dislay:index>2?'none':'block'}">
			<image :src="item.image" mode=""></image>
			<image :src="Platform" mode="" v-if="type=='subsidy'"></image>
			<image :src="Expired" v-if="item.status&&item.status!='1'"></image>
			<text v-if="item.status&&item.status!='1'"></text>
		</view>
		<view class="title">
			<text v-if="show">共{{shoppAll.length}}件</text>
			<uni-icons type="forward" size="20" color="#666666"></uni-icons>
		</view>
	</view>
</template>

<script setup lang="ts">
import { Expired ,Platform} from '@/utils/Static';
	const props = defineProps({
	  type: { type: String },
	  shoppAll:{type:Object},
	  show:{type:Boolean}
	});
</script>

<style scoped lang="less">
	.title{
		width: 19%;
		display: flex;
		align-items: center;
		justify-content: flex-end;
		font-size: 26rpx;
		font-weight: 400;
		color: #666666;
	}
	.images{
		width: 27%;
		position: relative;
		height: 186rpx;
		border-radius: 5px;
		overflow: hidden;
		margin: 15rpx 0px;
		display: flex;
		align-items: center;
		justify-content: center;
		image:nth-of-type(1){
			width: 96%;
			height: 180rpx;
		}
		image:nth-of-type(2){
			width: 111rpx;
			height: 35rpx;
			position: absolute;
			top: 0px;
			left: 0px;
			z-index: 4;
		}
		image:nth-of-type(3){
			width: 100rpx;
			height: 80rpx;
			position: absolute;
			z-index: 3;
		}
		text{
			width: 96%;
			height: 180rpx;
			position: absolute;
			z-index: 2;
			background: rgba(0,0,0,.2);
			border-radius: 5px;
		}
	}
</style>